<{include file="Public/top.html" }>
</head>
    <div id="warpper">
        <div class="content">
            <div class="location">卡券管理</div>
            <{include file="Card/nav.html"}>
            <div class="filedSet car_filedSet">
                <div class="topic">卡券信息</div>
                <div class="form-box border0 border-box">
                    <div class="Card_box">
                        <label class="ui-label">可用平台</label>
                        <div class="brand_item">
                            <select name="type" class="ui-select" id="platform">
                                <{foreach from = $card_platform key=key item=item}>
                                <option value="<{$key}>"><{$item}></option>
                                <{/foreach}>
                            </select>
                        </div>
                    </div>

                    <div class="Card_box uploader">
                        <label class="ui-label">卡券图片</label>
                        <span class="picture_box picture_150">
                            <input type="hidden" value=""  name="photo" id="photo">
                            <div class="a-imgBox" id="imgBox" style="display:none;">
                                <a href="javascript:;" class="a-close" onclick="removeElement('imgBox')"></a>
                                <img src="http://www.placehold.it/<{$card_width}>x<{$card_height}>" width="<{$card_width}>" height="<{$card_height}>"/>
                            </div>
                            <div>
                                <a href="javascript:;" class="a-upload">
                                    <input type="file" name="file" id="">
                                </a>
                                <i class="uptxt">上传图片</i>
                                <i>150*130</i>
                            </div>
                        </span>

                    </div>
                    <div class="Card_box">
                        <label class="ui-label">卡券类型</label>
                        <div class="brand_item">
                            <select name="type" class="ui-select" id="type">
                                <{foreach from = $card_type key=key item=item}>
                                <option value="<{$key}>"><{$item}></option>
                                <{/foreach}>
                            </select> 目前只实现团购券
                        </div>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">卡券颜色</label>
                        <div class="color_box">
                            <input type="text" name="color" value="#fff" id="full" />
                        </div>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">卡券主标题(字数上限为9个汉字)</label>
                        <div class="text_box">
                            <input required type="text" name="title" id="title" maxlength="9"/>0/9
                        </div>
                        <p class="frm_tips">建议填写代金券“减免金额”和自定义内容，描述卡券提供的具体优惠。</p>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">卡券副标题</label>
                        <div class="text_box">
                            <input  type="text" name="subTitle" id="subTitle"  maxlength="9"/>0/9
                        </div>
                        <p class="frm_tips">（选填，显示于主标题下方）</p>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">客服电话</label>
                        <div class="text_box">
                            <input  type="text" name="servicePhone"  id="servicePhone" maxlength="11"/>0/11
                        </div>
                        <p class="frm_tips">方便用户联系咨询</p>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">有效期</label>
                        <div class="radio_box">
                            <input required id="beginDate" name="beginDate" class="ui-select" type="text" />
                            <input required id="endDate" name="endDate" class="ui-select" type="text" />
                        </div>
                        <p class="frm_tips">建议填写代金券“减免金额”和自定义内容，描述卡券提供的具体优惠。</p>
                    </div>


                    <div class="Card_box">
                            <label class="ui-label">可用时段</label>
                            <div class="radio_box">
                                <p><input type="radio" id="time1" name="time"  required><label for="time1">&nbsp;&nbsp;全部时段</label></p>
                                <p><input type="radio" id="time2" name="time"  required><label for="time2">&nbsp;&nbsp;部分时段</label></p>
                                <div id="checkbox">
                                    <input type="checkbox" class="time-checkbox" name="availableDay[]" value="1" /><label>周一</label>
                                    <input type="checkbox" class="time-checkbox" name="availableDay[]" value="2" /><label>周二</label>
                                    <input type="checkbox" class="time-checkbox" name="availableDay[]" value="3" /><label>周三</label>
                                    <input type="checkbox" class="time-checkbox" name="availableDay[]" value="4" /><label>周四</label>
                                    <input type="checkbox" class="time-checkbox" name="availableDay[]" value="5" /><label>周五</label>
                                    <input type="checkbox" class="time-checkbox" name="availableDay[]" value="6" /><label>周六</label>
                                    <input type="checkbox" class="time-checkbox" name="availableDay[]" value="0" /><label>周日</label>
                                </div>
                            </div>
                        </div>


                    <div class="topic_box">优惠详情</div>
                    <div class="Card_box">
                        <label class="ui-label">简介<span style="color:#8d8d8d;">(选填,字数上限为1024个汉字)</span></label>
                        <textarea class="card-area" name="desc" id="desc" maxlength="1024"></textarea>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">使用须知<span style="color:#8d8d8d;">(选填,字数上限为16个汉字。)</span></label>
                        <textarea class="card-area" name="notice" id="notice" maxlength="16" ></textarea>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">优惠说明<span style="color:#8d8d8d;"></span></label>
                        <textarea class="card-area" name="deal_detail" id="deal_detail" maxlength="300" required></textarea>
                        <p class="frm_tips">使用本券具体有哪些优惠</p>
                    </div>
                    <div class="topic_box">门店信息</div>
                    <div class="Card_box">
                        <label class="ui-label">商户</label>
                        <div class="brand_item">
                            <select name="restaurantId" class="ui-select" id="restaurant">
                                <option value="0">不限商户</option>
                                <{foreach from = $restaurant_list item=item}>
                                <option value="<{$item.id}>"><{$item.restaurantName}></option>
                                <{/foreach}>
                            </select>
                        </div>
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">适用门店</label>
                        <div class="radio_box inline-block">
                            <p><input type="radio" id="store1" name="store" ><label for="store1">&nbsp;&nbsp;全部门店适用</label></p>
                            <p><input type="radio" id="store2" name="store" checked ><label for="store2">&nbsp;&nbsp;指定门店适用</label></p>
                            <div id="mainGrid" class="mainGrid store_box" style="display: block; margin: 10px 0px;">
                                <table class="ui-table ui-body">
                                    <thead>
                                    <tr>
                                        <th width="22"><input type="checkbox" id="allStore"></th>
                                        <th class="pct50">门店名称</th>
                                        <th class="pct50">地 址</th>
                                    </tr>
                                    </thead>
                                    <tbody id="store-wrapper">
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="Card_box stock-wrapper">
                        <label class="ui-label">库存</label>
                        <input type="text" class="ui-text" maxlength="10000" id="stock" name="stock" value="0" placeholder="0,表示无库存" required/>&nbsp;&nbsp;份
                    </div>
                    <div class="Card_box">
                        <label class="ui-label">每人限领</label>
                        <input type="text" class="ui-text"  value="1"  id="quota" name="quota"  required/>&nbsp;&nbsp;份
                    </div>

                    <div class="integral_btn-group">
                        <input type="button" value="确认" id="submit-btn" class="ui-button"/>
                    </div>

                </div>

            </div>
        </div>
    </div>
    <body>
<{include file="Public/foot.html" }>
<script src="<{$preStaticUrl}>Admin/js/docs.js?v=<{$resVersion}>"></script>
<script src="<{$preStaticUrl}>Admin/js/spectrum.js?v=<{$resVersion}>"></script>
<script>
    function removeElement(id)
    {
        document.getElementById(id).style.display="none";
        //删除图片
        $("#photo").val('');
        $('.uptxt').text('上传图片');
    }

    $(function(){
        //根据选着不同的商户 显示不同的门店
                $.ajax({
                    url:"./api.php?m=Api&c=Business&a=getStoreList",
                    dataType:"json",
                    type:"GET",
                    success:function(data){
                        var obj = data.data;
                        $.each(obj,function(n,value){
                            $html = '<tr>';
                            $html+= '<td><input type="checkbox" name="storeId[]" class="store-checkbox" value="'+value.id+'" /></td>';
                            $html+= '<td>'+value.storeName+'</td>';
                            $html+= '<td>'+value.address+'</td>';
                            $html+= '</tr>';
                            $('#store-wrapper').append($html);
                        });
                    },
                    error:function(data){
                        layer.msg('异常');
                    },
                });



        datePickter('beginDate','endDate',true);
        $(".bg").width($(document).width()).height($(document).height()).css({'left':0,'top':0});



        //根据选着不同的商户 显示不同的门店
        $("#restaurant").bind("change", changeRestaurant);
        function changeRestaurant(){
            $('#store-wrapper').html("");
            var id = $(this).val();
            $.ajax({
                url:"./api.php?m=Api&c=Business&a=getStoreListByRestaurantId",
                dataType:"json",
                data:{"id":id},
                type:"GET",
                success:function(data){
                    var obj = data.data;
                    $.each(obj,function(n,value){
                        $html = '<tr>';
                        $html+= '<td><input type="checkbox" name="storeId[]" class="store-checkbox" value="'+value.id+'" /></td>';
                        $html+= '<td>'+value.storeName+'</td>';
                        $html+= '<td>'+value.address+'</td>';
                        $html+= '</tr>';
                        $('#store-wrapper').append($html);
                    });
                },
                error:function(data){
                    layer.msg('异常');
                },
            });
        }

        //全部门店通用按钮
        $('#store1').click(function(event){
            $('#mainGrid').hide();
            $(".store-checkbox").each(function() {  
                $(this).attr("checked", true);
            }); 
        });
        //指定门店通用按钮
        $('#store2').click(function(event){
            $('#mainGrid').show();
            $(".store-checkbox").each(function() {  
                $(this).attr("checked", false);  
            }); 
        });

        //全选按钮
        $('#allStore').click(function(event){
            $(".store-checkbox").each(function() {
                if($('#allStore').prop('checked') == true){
                    $(this).attr("checked", true);
                }else{
                    $(this).attr("checked", false);
                }
            });
        });

        // 全部时段按钮
        $('#time1').click(function(event){
            $('#checkbox').hide();
            $(".time-checkox").each(function() {
                $(this).attr("checked", true);
            });
        });
        //部分时段按钮
        $('#time2').click(function(event){
            $('#checkbox').show();
            $(".time-checkox").each(function() {
                $(this).attr("checked", false);
            });
        });
        //提交按钮 以ajax提交
        $('#submit-btn').click(function(event){

            //获取所有的可用门店的按钮
            var platform=$('#platform').val();
            var photo=$('#photo').val();
            if(photo==''){
                layer.msg("卡券图片必须上传");
                return;
            }

            var storecheckbox = $('.store-checkbox');
            var timecheckbox = $('.time-checkbox');
            // 获取库存
            var stock = parseInt($('#stock').val());
            var quota = parseInt($('#quota').val());
            //获取商户id
            var restaurantId =   $('#restaurant').val();
            //获取卡券类型
            var type =   $('#type').val();
            //获取卡券背景颜色
            var color =  tinycolor($('#full').val()).toHexString();
            //获取卡券的标题
            var title = $('#title').val();
            var subTitle=$('#subTitle').val();
            var servicePhone=$('#servicePhone').val();
            //获取卡券的简介
            var desc =  $('#desc').val();
            var deal_detail=$('#deal_detail').val();
            //获取卡券的优惠须知
            var notice =  $('#notice').val();

            //获取卡券有效期
            var beginDate   = $('#beginDate').val();
            var endDate     = $('#endDate').val();

            if(beginDate.length<2 || endDate.length<2){
                layer.msg("卡券有效期必须填写");
                return;
            }


            var storeId = new Array();

            if($('#store1').prop('checked')==true){
                storeId=0;
            }else {
                //获取所有勾选的门店
                $.each(storecheckbox, function (n, value) {
                    if ($(this).prop('checked') == true) {
                        storeId[n] = $(this).val();
                    }
                });
            }

            if(title.length<2){
                layer.msg("卡券主标题必须填写");
                return;
            }
            if(storeId.length==0){
                layer.msg("请选定适用的门店");
                return;
            }

            if(deal_detail.length<3){
                layer.msg("优惠说明是必填项");
                return;
            }

            var availableDay = new Array();
            if($('#time1').prop('checked')==true){
                availableDay='0,1,2,3,4,5,6';
            }else {
                $.each(timecheckbox, function (n, value) {
                    if ($(this).prop('checked') == true) {
                        availableDay[n] = $(this).val();
                    }
                });
            }

                //讲生成卡券号 分成10次批量上传

                var currentNum = 1;
                //打开遮罩层
                $('.bg').css('display','block');
                //初始化进度条
                $('.progess-bar').css({"width":'0px'});
                //先生成卡券基本信息表
                $.ajax({
                    url:"<{U('Card/ajaxAddCard')}>",
                    dataType:"json",
                    data:{
                        'platform':platform,
                        'type' : type,
                        'photo': photo,
                        'color': color,
                        'title': title,
                        'desc' : desc,
                        'notice' : notice,
                        'storeId': storeId,
                        'restaurantId':restaurantId,
                        'stock' : stock,
                        'quota' : quota,
                        'beginDate':beginDate,
                        'endDate':endDate,
                        'subTitle':subTitle,
                        'servicePhone':servicePhone,
                        'deal_detail':deal_detail,
                        'availableDay':availableDay
                    },
                    type:"POST",
                    success:function(data){
                        if(data.status == 0){
                            var data = {
                                'cardId':data.data['cardId'],
                                'cardTitle':data.data['cardTitle'],
                                'stock':stock,
                            };
                            layer.msg('基础卡券信息成功添加，现在开始生成卡券号');
                            //生成卡券号列表
                            creatCodeList(data);
                        }else{
                            $('.bg').css('display','none');
                            layer.msg(data.msg);
                        }
                    },
                    error:function(data){
                        layer.msg('异常');
                    },
                });

        });
        function creatCodeList(data){
            var data = data;
             $.ajax({
                url:"<{U('Card/ajaxAddCodeList')}>",
                dataType:"json",
                // async:false,
                //关闭同步
                data:data,
                type:"POST",
                success:function(obj){
                    if(obj.status == 0){
                        data['p'] = obj.p;

                            if(obj.finish==1){
                                if(obj.deposit==1) {
                                    layer.confirm('<p style="color:black">卡券号已全部生成,现在上传么？</p>', {
                                        btn: ['是', '否'] //按钮
                                    }, function () {
                                        layer.closeAll();
                                        depositWeixinCode(data.cardId);
                                    }, function () {

                                    });
                                }else{
                                    layer.msg("券号全全部生成");
                                    location.href="<{U('Card/index')}>";
                                }

                            }else{
                                creatCodeList(data);
                            }
                    }else{
                        layer.msg(obj.msg);
                    }
                },
            });
        }
        function depositWeixinCode(cardId){
            var data={'cardId':cardId};
            $.ajax({
                url:"<{U('Card/ajaxDepositCode')}>",
                dataType:"json",
                data:data,
                type:"POST",
                success:function(obj){
                    if(obj.status == 0){
                        depositWeixinCode(cardId);
                        layer.msg(obj.msg);
                    }else{
                        layer.msg(obj.msg);
                    }
                },
            });
        }
        (function ($) {
        'use strict';
        $.fn.uploader = function () {
            return this.each(function () {
                var $this = $(this);
                var $file = $this.find('input[type=file]');
                var $hidden = $this.find('input[type=hidden]');
                var $txt = $this.find('i.uptxt');
                var $img =$this.find('img');
                var $imgBox = $this.find('div[id=imgBox]');
                $file.AjaxFileUpload({
                    action: './api.php?m=Api&c=index&a=ajaxUpload&from=IMG_CARD',
                    onSubmit: function () {
                        $txt.text('上传中');
                    },
                    onComplete: function (filename, response) {
                        if(parseInt(response.id)>0){
                            $txt.text("上传成功");
                            $img.attr('src',response.msg);
                            $imgBox.css('display','block');
                        }else{
                            $txt.text(response.msg);
                        }
                        $hidden.attr('value', response.msg);
                    }
                });
            });
        }
    })(jQuery);

    $('.uploader').uploader();
    });

</script>
